<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <title>Document</title>
</head>
<body onload="init()">
    <div class="container">
    <table class="table" id="table">
        <caption>
            <h2>习题</h2>
        </caption>
        <caption>
            <button class="btn btn-info" id = "user_add" data-toggle="modal" data-target="#modal01">新增</button>
            <button class="btn btn-info" id = "user_delete">删除</button>
            <button class="btn btn-info" id = "user_editor" data-toggle="modal" data-target="#modal01">编辑</button>
            <button class="btn btn-info" id = "user_select">查询</button>
    
            <input type="text" id = "findById" placeholder="按工号查询" style="width:130px">
            <input type="text" id = "findByName" placeholder="按姓名查询" style="width:130px">
        </caption>
        <thead>
            <tr>
                <th>序号</th>
                <th>工号</th>
                <th>姓名</th>
                <th>性别</th>
                <th>密码</th>
                <th>年龄</th>
                <th>出生日期</th>
            </tr>
        </thead>
        <tbody id="tbody">            
        </tbody>
    </table>
     <!--声明定义模态框组件-->
     <div class="modal" id="modal01" role="dialog">
        <!--窗口声明-->
        <div class = "modal-dialog">
            <!--内容声明-->
            <div class="modal-content">
                <!--框的标题-->
                <div class="modal-header">
                    <button class="close" data-dismiss="modal" aria-hidden="true">
                        <span>&times;</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">
                        新增用户
                    </h4>
                </div>
                <!--框内的内容-->
                <div class="modal-body" id="modal-body">
                    <label for="name">工号：</label>
                    <input type="text" class="form-control" id="m_code" placeholder="请输入工号">
                    <label for="name">姓名：</label>
                    <input type="text" class="form-control" id="m_userName" placeholder="请输入姓名">
                    <label for="name">性别：</label>
                    <input type="text" class="form-control" id="m_sex" placeholder="请输入性别">
                    <label for="name">密码：</label>
                    <input type="text" class="form-control" id="m_password" placeholder="请输入密码">
                    <label for="name">年龄：</label>
                    <input type="text" class="form-control" id="m_age" placeholder="请输入年龄">
                    <label for="name">出生日期：</label>
                    <input type="text" class="form-control" id="m_birthday" placeholder="请输入生日">
                </div>
                <!--框内的按钮-->
                <div class="modal-footer">
                    <button class="btn btn-default"  id="save" data-dismiss="modal">保存</button>
                    <button class="btn btn-primary" type="button">提交更改</button>
                </div>
            </div>
        </div>
    </div>
    </div>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/modal.js"></script>
</body>
</html>